<template>
<div class="main_box">
  <div class="add_wrap">
    <div class="tit">
      <h2>基础信息</h2>
      <el-button plain size="mini" type="success" icon="fa fa-mail-forward" @click="returnList">返回</el-button>
    </div>
    <el-form :model="dataForm" ref="dataForm" label-width="200px" :rules="roleRules">
      <el-row>

        <el-form-item label="商户名称" prop="organName">
          <el-input v-model="dataForm.organName"></el-input>
        </el-form-item>
        <el-form-item label="商户类型" prop="organType">
          <el-select v-model="dataForm.organType" placeholder="请选择商户类型">
            <el-option
              v-for="item in organTypeList"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="数据加密方式" prop="signMethod">
          <el-select v-model="dataForm.signMethod" placeholder="请选择数据加密方式">
            <el-option
              v-for="item in signMethodList"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="访问令牌有效时长" prop="vaildDay">
          <el-select v-model="dataForm.vaildDay" placeholder="请选择访问令牌有效时长">
            <el-option v-for="item in vaildDayList" :label="item.name" :value="item.id" :key="item.id"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="联系人" prop="linkMan">
          <el-input v-model="dataForm.linkMan"></el-input>
        </el-form-item>
        <el-form-item label="联系电话" prop="linkPhone">
          <el-input type="number" v-model.number="dataForm.linkPhone"></el-input>
        </el-form-item>
        <el-form-item label="联系地址" prop="linkAddr">
          <el-input v-model="dataForm.linkAddr"></el-input>
        </el-form-item>
        <el-form-item label="备注" prop="remark">
          <el-input type="textarea" v-model="dataForm.remark"></el-input>
        </el-form-item>
      </el-row>
      <el-row>
        <el-form-item>
          <el-button plain type="primary" @click="sureClick">保 存</el-button>
          <el-button @click="returnList">取 消</el-button>
        </el-form-item>
      </el-row>
    </el-form>
  </div>
 </div>
</template>

<script>
import * as message from "@/constants/message";
import OrganAuthApi from "@/api/organ/organAuth";
export default{
  data(){
      return {
        dataForm:{
          organId: "",
          organName: "",
          // appKey: "",
          // appSecret:"",
          // accessToken: "",
          // organType: "",
          signMethod: "open",
          vaildDay: "",
          linkMan: "",
          linkPhone: "",
          linkAddr: "",
          remark:"",
        },
        // keyState: false,   // 商户号输入框状态
        loadingIns:false,
        organTypeList: [
          { label: '系统', value: 1 },
          { label: '其他', value: 10}
        ],
        signMethodList: [
          { label: 'open', value: 'open' },
          { label: 'plaintext(明文)', value: 'plaintext' },
          { label: 'sha256', value: 'sha256'},
          { label: 'md5', value: 'md5'},
        ],
        vaildDayList:[
          {id:7,name:"7天"},
          {id:30,name:"30天"},
          {id:365,name:"1年"},
          {id:3650,name:"10年"}
        ],
        // 7:7天 30:30天 365:1年 3650:10年)
        roleRules: {
          organName: [
            { required: true, message: "请输入商户名称", trigger: "blur" },
            { max: 30, message: '长度不超过30个字', trigger: 'blur' }
          ],
          organType:[
            { required: true, message: "请选择商户类型", trigger: "change" }
          ],
          // appKey: [
          //   { max: 6, message: '长度不超过6位数字', trigger: 'blur' }
          // ],
          // appKey:[
          //   { required: true, message: "请输入商户号", trigger: "blur" }
          // ],
          // appSecret:[
          //   { required: true, message:"请输入商户密钥", trigger:"blur"}
          // ],
          // accessToken:[
          //   { required: true, message:"请输入访问令牌", trigger:"blur"}
          // ],
          signMethod:[
            { required: true, message:"请选择数据加密方式", trigger:"change"}
          ],
          vaildDay:[
            { required: true, message:"请选择访问令牌有效时长", trigger:"change"}
          ],
          linkPhone:[
            { pattern: /^400[0-9]{7}|^1[345789]\d{9}$|^0[0-9]{2,3}-[0-9]{8}/, message: "电话格式错误", trigger: "blur" },
          ]
        }
      }
  },
  components: {
  },
  methods: {
    init(){
      if (this.$route.query.id) {
        this.dataForm.organId = this.$route.query.id
        this.getData()
      }
    },
    sureClick() {
      this.$refs.dataForm.validate(valid => {
        if (valid) {
          this.$confirm(message.MSG_CONFIRM_SAVE_ALTER, message.TITLE_PROMPT, {})
            .then(() => {
              const params = {...this.dataForm}
              if (params.organId){
                this.editData(params);
              }else{
                Reflect.deleteProperty(params,'organId')
                this.addData(params);
              }
          });
        }
      })
    },
    addData(params) {
      OrganAuthApi.addOrganAuth(params)
      .then(data => {
        this.$message({
          type: 'success',
          message: message.MSG_ACTION_SUCCESS
        });
        this.returnList();
      })
    },
    editData(params) {
      OrganAuthApi.editOrganAuth(params)
        .then(data => {
          this.$message({
            type: 'success',
            message: message.MSG_ALTER_SUCCESS
          });
          this.returnList();
        })
    },
    getData () {
      OrganAuthApi.getOrganAuthInfo({
        organId: this.$route.query.id
      }).then(res => {
        this.$Utils.bindingBean(this.dataForm, res.data)
      })
      this.keyState = true
    },
    returnList(){
      this.$store.dispatch('delView', this.$route);
      this.$router.push({path: '/organ/organAuthManagement'});
    }
  },
  mounted(){
    this.init()
  }
}
</script>
<style lang="scss" scoped>
@import "@/assets/css/views/add.scss";
</style>
